{% extends 'adminuser/base_admin.html' %}

{% block admin_title %}系统设置{% endblock %}

{% block admin_content %}
<div class="row">
    <div class="col-md-12">
        <div class="card mb-4">
            <div class="card-header bg-light d-flex justify-content-between align-items-center">
                <h5 class="mb-0">系统设置</h5>
            </div>
            <div class="card-body">
                <form method="post">
                    {% csrf_token %}
                    
                    <div class="row mb-4">
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label for="site_name" class="form-label">网站名称</label>
                                <input type="text" class="form-control" id="site_name" name="site_name" 
                                       value="{{ settings.site_name }}" required>
                                <div class="form-text">显示在页面标题和页脚的网站名称</div>
                            </div>
                            
                            <div class="mb-3">
                                <label for="site_description" class="form-label">网站描述</label>
                                <textarea class="form-control" id="site_description" name="site_description" 
                                          rows="3">{{ settings.site_description }}</textarea>
                                <div class="form-text">简短描述网站的主要功能和目的</div>
                            </div>
                        </div>
                        
                        <div class="col-md-6">
                            <div class="card h-100 bg-light">
                                <div class="card-body">
                                    <h6 class="card-title mb-3">网站信息预览</h6>
                                    <div class="mb-2">
                                        <strong>网站名称:</strong> <span id="preview_site_name">{{ settings.site_name }}</span>
                                    </div>
                                    <div>
                                        <strong>网站描述:</strong> <span id="preview_site_description">{{ settings.site_description }}</span>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    
                    <div class="row mb-4">
                        <div class="col-md-12">
                            <h5 class="border-bottom pb-2 mb-3">权限设置</h5>
                        </div>
                        
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label">注册权限</label>
                                <div class="form-check">
                                    <input class="form-check-input" type="radio" name="allow_registration" 
                                           id="allow_registration_yes" value="True" 
                                           {% if settings.allow_registration %}checked{% endif %}>
                                    <label class="form-check-label" for="allow_registration_yes">
                                        允许新用户注册
                                    </label>
                                </div>
                                <div class="form-check">
                                    <input class="form-check-input" type="radio" name="allow_registration" 
                                           id="allow_registration_no" value="False" 
                                           {% if not settings.allow_registration %}checked{% endif %}>
                                    <label class="form-check-label" for="allow_registration_no">
                                        关闭新用户注册
                                    </label>
                                </div>
                                <div class="form-text">关闭注册后，新用户将无法创建账号</div>
                            </div>
                        </div>
                        
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label">故事创建权限</label>
                                <div class="form-check">
                                    <input class="form-check-input" type="radio" name="allow_story_creation" 
                                           id="allow_story_creation_yes" value="True" 
                                           {% if settings.allow_story_creation %}checked{% endif %}>
                                    <label class="form-check-label" for="allow_story_creation_yes">
                                        允许用户创建故事
                                    </label>
                                </div>
                                <div class="form-check">
                                    <input class="form-check-input" type="radio" name="allow_story_creation" 
                                           id="allow_story_creation_no" value="False" 
                                           {% if not settings.allow_story_creation %}checked{% endif %}>
                                    <label class="form-check-label" for="allow_story_creation_no">
                                        关闭故事创建功能
                                    </label>
                                </div>
                                <div class="form-text">关闭后，普通用户将无法创建新故事，管理员不受影响</div>
                            </div>
                        </div>
                    </div>
                    
                    <div class="row mb-4">
                        <div class="col-md-12">
                            <h5 class="border-bottom pb-2 mb-3">维护模式</h5>
                        </div>
                        
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label">网站状态</label>
                                <div class="form-check">
                                    <input class="form-check-input" type="radio" name="maintenance_mode" 
                                           id="maintenance_mode_no" value="False" 
                                           {% if not settings.maintenance_mode %}checked{% endif %}>
                                    <label class="form-check-label" for="maintenance_mode_no">
                                        正常运行
                                    </label>
                                </div>
                                <div class="form-check">
                                    <input class="form-check-input" type="radio" name="maintenance_mode" 
                                           id="maintenance_mode_yes" value="True" 
                                           {% if settings.maintenance_mode %}checked{% endif %}>
                                    <label class="form-check-label" for="maintenance_mode_yes">
                                        维护模式
                                    </label>
                                </div>
                                <div class="form-text text-warning">开启维护模式后，只有管理员可以访问网站</div>
                            </div>
                        </div>
                        
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label for="maintenance_message" class="form-label">维护信息</label>
                                <textarea class="form-control" id="maintenance_message" name="maintenance_message" 
                                          rows="3">{{ settings.maintenance_message }}</textarea>
                                <div class="form-text">在维护模式下显示给用户的信息</div>
                            </div>
                        </div>
                    </div>
                    
                    <div class="mt-4 text-end">
                        <button type="submit" class="btn btn-primary">
                            <i class="bi bi-save me-1"></i> 保存设置
                        </button>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
{% endblock %}

{% block extra_js %}
<script>
document.addEventListener('DOMContentLoaded', function() {
    // 实时预览网站信息
    const siteNameInput = document.getElementById('site_name');
    const siteDescInput = document.getElementById('site_description');
    const previewName = document.getElementById('preview_site_name');
    const previewDesc = document.getElementById('preview_site_description');
    
    siteNameInput.addEventListener('input', function() {
        previewName.textContent = this.value;
    });
    
    siteDescInput.addEventListener('input', function() {
        previewDesc.textContent = this.value;
    });
});
</script>
{% endblock %} 